Adwaita: fix selected colorswatch white border

diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss
index e7b4d56e56d6cb2bace39afbb74bc77684d6fcfd..2216e28372ada899e0ad7ad3a9eb877f81237aaf 100644 (file)
--- a/gtk/resources/theme/Adwaita/_common.scss
+++ b/gtk/resources/theme/Adwaita/_common.scss
@@ -2924,7 +2924,20 @@ GtkColorSwatch {
   // is GtkColorSwatch .overlay {}, GtkColorSwatch has the programmatically set background, so most of the style
   // is applied to the overlay box.
 
-  box-shadow: inset 0 1px transparentize(black, 0.9), _widget_edge();
+  $_colorswatch_shadow: inset 0 1px transparentize(black, 0.9), _widget_edge();
+
+  box-shadow: $_colorswatch_shadow;
+
+  // take care of colorswatches on selected elements
+  :selected & {
+    box-shadow: none;
+    &.overlay, &.overlay:hover {
+      border-color: $selected_fg_color;
+    }
+  }
+
+  // we need to re-set the shadow here since it get axed by the previous bit
+  &:selected { box-shadow: $_colorswatch_shadow; }
 
   // border rounding
   &.top {
@@ -2949,7 +2962,8 @@ GtkColorSwatch {
   // nth-child works just on the custom colors row
 
   // hover effect
-  &:hover {
+  &:hover,
+  &:hover:selected {
     background-image: linear-gradient(135deg, transparentize(white, 0.3),
                                               transparentize(white, 1) 50%);
     box-shadow: inset 0 1px transparentize(white, 0.6),
@@ -2983,7 +2997,8 @@ GtkColorSwatch {
   }
 
   // border color
-  &.overlay {
+  &.overlay,
+  &.overlay:selected {
     border: 1px solid if($variant == 'light', transparentize(black, 0.7), $borders_color);
     &:hover { border-color: if($variant == 'light', transparentize(black, 0.5), black); }
   }
@@ -2997,15 +3012,6 @@ GtkColorSwatch {
     &:backdrop { @include button(backdrop); }
     .overlay { @include button(undecorated); } // reset the overlay to not cover the button style underneat
   }
-
-  // take care of colorswatches on selected elements
-  :selected & {
-    box-shadow: none;
-    &.overlay {
-      border-color: $selected_fg_color;
-    }
-  }
-
 }
 
 

diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index a2645114b663a1f64b8b0055df2e74e3a38b95c9..892b18d2ef07d975f31574dfeee370c368bbb8e9 100644 (file)
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -4354,6 +4354,12 @@ GtkInfoBar {
  *****************/
 GtkColorSwatch {
   box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
+  :selected GtkColorSwatch {
+    box-shadow: none; }
+    :selected GtkColorSwatch.overlay, :selected GtkColorSwatch.overlay:hover {
+      border-color: #ffffff; }
+  GtkColorSwatch:selected {
+    box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
   GtkColorSwatch.top {
     border-top-left-radius: 5px;
     border-top-right-radius: 5px; }
@@ -4368,7 +4374,7 @@ GtkColorSwatch {
     border-bottom-right-radius: 5px; }
   GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay {
     border-radius: 5px; }
-  GtkColorSwatch:hover {
+  GtkColorSwatch:hover, GtkColorSwatch:hover:selected {
     background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), inset 0 -1px rgba(0, 0, 0, 0.4); }
   GtkColorSwatch:backdrop {
@@ -4391,9 +4397,9 @@ GtkColorSwatch {
     outline-color: rgba(255, 255, 255, 0.5); }
     GtkColorSwatch.color-light:backdrop {
       color: rgba(0, 0, 0, 0.3); }
-  GtkColorSwatch.overlay {
+  GtkColorSwatch.overlay, GtkColorSwatch.overlay:selected {
     border: 1px solid #1c1f1f; }
-    GtkColorSwatch.overlay:hover {
+    GtkColorSwatch.overlay:hover, GtkColorSwatch.overlay:selected:hover {
       border-color: black; }
   GtkColorSwatch#add-color-button {
     border-style: solid;
@@ -4427,10 +4433,6 @@ GtkColorSwatch {
       box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0);
       text-shadow: none;
       icon-shadow: none; }
-  :selected GtkColorSwatch {
-    box-shadow: none; }
-    :selected GtkColorSwatch.overlay {
-      border-color: #ffffff; }
 
 /********
  * Misc *

diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index 5ed69f378fad1920bee6d9af38ce2b9d66d9f026..e9ee1d29b119b763ae5ae0f76e2cf459b54c5deb 100644 (file)
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -4515,6 +4515,12 @@ GtkInfoBar {
  *****************/
 GtkColorSwatch {
   box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px white; }
+  :selected GtkColorSwatch {
+    box-shadow: none; }
+    :selected GtkColorSwatch.overlay, :selected GtkColorSwatch.overlay:hover {
+      border-color: #ffffff; }
+  GtkColorSwatch:selected {
+    box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px white; }
   GtkColorSwatch.top {
     border-top-left-radius: 5px;
     border-top-right-radius: 5px; }
@@ -4529,7 +4535,7 @@ GtkColorSwatch {
     border-bottom-right-radius: 5px; }
   GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay {
     border-radius: 5px; }
-  GtkColorSwatch:hover {
+  GtkColorSwatch:hover, GtkColorSwatch:hover:selected {
     background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), inset 0 -1px rgba(0, 0, 0, 0.1); }
   GtkColorSwatch:backdrop {
@@ -4552,9 +4558,9 @@ GtkColorSwatch {
     outline-color: rgba(255, 255, 255, 0.5); }
     GtkColorSwatch.color-light:backdrop {
       color: rgba(0, 0, 0, 0.3); }
-  GtkColorSwatch.overlay {
+  GtkColorSwatch.overlay, GtkColorSwatch.overlay:selected {
     border: 1px solid rgba(0, 0, 0, 0.3); }
-    GtkColorSwatch.overlay:hover {
+    GtkColorSwatch.overlay:hover, GtkColorSwatch.overlay:selected:hover {
       border-color: rgba(0, 0, 0, 0.5); }
   GtkColorSwatch#add-color-button {
     border-style: solid;
@@ -4588,10 +4594,6 @@ GtkColorSwatch {
       box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0);
       text-shadow: none;
       icon-shadow: none; }
-  :selected GtkColorSwatch {
-    box-shadow: none; }
-    :selected GtkColorSwatch.overlay {
-      border-color: #ffffff; }
 
 /********
  * Misc *